<template>
  <div class="date-time-picker">
    <van-datetime-picker
      v-model="currentDate"
      type="date"
      :min-date="minDate"
      :formatter="formatter"
      :confirm-button-text="confirmText"
      :visible-item-count="countNum"
      :title="title"
    />
   <van-collapse v-model="activeName" accordion>
  <van-collapse-item title="标题1" name="1">内容</van-collapse-item>
  <van-collapse-item title="标题2" name="2">内容</van-collapse-item>
  <van-collapse-item title="标题3" name="3">内容</van-collapse-item>
  <van-collapse-item title="标题3" name="4">内容</van-collapse-item>
</van-collapse>
  </div>
</template>

<script>
export default {
  name: "",
  data() {
    return {
      currentDate: new Date(),
      minDate: new Date(2009, 10, 1),
      confirmText: "确定吗",
      countNum: 3,
      title: "请选择时间",
      activeNames: ['1'],
       activeName: '1'
    };
  },
  methods: {
    formatter(type, value) {
      return type === "year"
        ? `${value}年`
        : type === "month"
        ? `${value}月`
        : type === "day"
        ? `${value}日`
        : value;
    }
  },
  components: {},
  computed: {},
  watch: {},
  //生命周期 - 创建完成（可以访问当前this实例）
  created() {},
  //生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {},
  updated() {}, //生命周期 - 更新之后
  activated() {} //如果页面有keep-alive缓存功能，这个函数会触发
};
</script>
<style lang='less' scoped>
//@import url(); 引入公共css类
</style>